<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <meta charset="utf-8">
    <title>教练信息编辑</title>
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/favicon.ico"/>
    <link rel="bookmark" href="${pageContext.request.contextPath}/favicon.ico"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/webjars/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/private/css/formselects/formSelects-v4.css">
    <script type="application/javascript" src="${pageContext.request.contextPath}/webjars/layui/layui.js"
            charset="utf-8"></script>
    <script type="application/javascript" src="${pageContext.request.contextPath}/webjars/jquery/jquery.js"></script>
    <script type="application/javascript"
            src="${pageContext.request.contextPath}/private/js/loading/ajaxloading.js"></script>
</head>
<body>
<form id="form1" class="layui-form" action="">
    <table width="96%" align="center">
        <tr height="23">
            <td align="center">课程:</td>
            <td align="left">
                <input type="hidden" id="recordid" name="recordid" value="${recordInfo.recordid}">
                <select id="classid" name="classid" lay-verify="classid" lay-search>
                    <option value="">录入关键字查询并选择</option>
                </select>
            </td>
        </tr>
        <tr height="23">
            <td align="center">适龄年龄段:</td>
            <td align="left">
                <select id="agerange" name="agerange" lay-verify="agerange">
                    <option value="">请选择</option>
                </select>
            </td>
        </tr>
        <tr height="23">
            <td align="center">授课教练:</td>
            <td align="left">
                <select id="coachid" name="coachid" lay-verify="coachid" lay-search lay-filter="coachidchange">
                    <option value="">录入关键字查询并选择</option>
                </select>
            </td>
        </tr>
        <tr height="23">
            <td align="center">助教:</td>
            <td align="left">
                <select name="assistantids" xm-select="assistantids" xm-select-height="36px"
                        xm-select-search-type="title"
                        xm-select-search
                >
                    <option value="">录入关键字查询并选择</option>
                </select>
            </td>
        </tr>
        <tr height="23">
            <td align="center">授课时间:</td>
            <td align="left">
                <input id="starttime" name="starttime" class="layui-input" type="text" placeholder="yyyy-MM-dd"
                       autocomplete="off" value="${recordInfo.starttime_str}"
                       lay-verify="starttime">
            </td>
        </tr>
        <tr height="23">
            <td align="center">上课时间:</td>
            <td align="left">
                <input id="begintime" name="begintime" class="layui-input" type="text" placeholder="HH:mm:ss"
                       autocomplete="off" value="${recordInfo.begintime_str}"
                       lay-verify="begintime">
            </td>
        </tr>
        <tr height="23">
            <td align="center">下课时间:</td>
            <td align="left">
                <input id="endtime" name="endtime" class="layui-input" type="text" placeholder="HH:mm:ss"
                       autocomplete="off" value="${recordInfo.endtime_str}"
                       lay-verify="endtime">
            </td>
        </tr>
        <tr height="23">
            <td align="center">上课地点:</td>
            <td align="left">
                <input id="address" name="address" class="layui-input" type="text" placeholder="请输入上课地点"
                       autocomplete="off" value="${recordInfo.address}"
                       lay-verify="address">
            </td>
        </tr>
        <tr height="23">
            <td align="center">课程详情:</td>
            <td align="left">
                <textarea name="details" placeholder="请输入课程概要信息，可不填" class="layui-textarea"
                          lay-verify="details">${recordInfo.details}</textarea>
            </td>
        </tr>
        <tr height="23">
            <td align="center">最大上课人数:</td>
            <td align="left">
                <input id="maxnum" name="maxnum" class="layui-input" type="text" placeholder="请输入最大上课人数"
                       autocomplete="off" value="${recordInfo.maxnum}"
                       lay-verify="number">
            </td>
        </tr>
        <tr height="23">
            <td align="center">学时:</td>
            <td align="left">
                <input id="recordhour" name="recordhour" class="layui-input" type="text" placeholder="请输入学时"
                       autocomplete="off" value="${recordInfo.recordhour}"
                       lay-verify="number">
            </td>
        </tr>
        <tr height="23">
            <td align="center">开班状态:</td>
            <td align="left">
                <select id="status" name="status" lay-verify="status">
                </select>
            </td>
        </tr>

        <%--当新增数据的时候，显示下拉框--%>
        <c:if test="${empty recordInfo.recordid}">
            <tr height="23">
                <td align="center">课程新增方案:</td>
                <td align="left">
                    <select id="inserttype" name="inserttype" lay-verify="inserttype">
                        <option value="0">仅限当天</option>
                        <option value="1">包含1周</option>
                        <option value="2">包含2周</option>
                        <option value="3">包含3周</option>
                    </select>
                </td>
            </tr>
        </c:if>

        <tr height="50">
            <td align="center">
                <button id="formsubmit" class="layui-btn" lay-submit lay-filter="saverecordinfo">保存</button>
            </td>
        </tr>
    </table>
</form>
</body>
<script type="application/javascript">
    //全局定义一次, 加载formSelects
    layui.config({
        base: '${pageContext.request.contextPath}/private/js/formselects/' //此处路径请自行处理, 可以使用绝对路径
    }).extend({
        formSelects: 'formSelects-v4.min'
    });
    var form;
    var assistant;
    layui.use(['form','laydate','formSelects'], function(){
        form = layui.form;
        assistant = layui.formSelects;
        assistant.render("assistantids");
        assistant.on('assistantids', function(id, vals, val, isAdd, isDisabled){
            var coachid = $("#coachid").val();
            if(coachid) {
                //选中助教时
                if(isAdd&&val.value==coachid) {
                    layer.msg("选择的助教和主教练重复");
                    return false;
                }
            }
            //id:           点击select的id
            //vals:         当前select已选中的值
            //val:          当前select点击的值
            //isAdd:        当前操作选中or取消
            //isDisabled:   当前选项是否是disabled

            //如果return false, 那么将取消本次操作
            return true;
        });



        //日期控件
        var laydate = layui.laydate;
        //执行一个laydate实例
        laydate.render({
            elem: '#starttime' //指定元素
        });
        laydate.render({
            elem: '#endtime', //指定元素
            type: 'time'
        });
        laydate.render({
            elem: '#begintime', //指定元素
            type: 'time'
        });

        //表单验证规则自定义
        form.verify({
            classid: function(value){
                if(!value) {
                    return '请选择课程';
                }
            },
            coachid: function(value){
                if(!value) {
                    return '请选择授课教练';
                }
            },
            starttime: function(value){
                if(!value) {
                    return '请填写授课时间';
                }
            },
            begintime: function(value){
                if(!value) {
                    return '请填写上课时间';
                }
            },
            endtime: function(value){
                if(!value) {
                    return '请填写下课时间';
                }
            },
            address: function(value){
                if(!value) {
                    return '请填写上课地点';
                }
            },
            maxnum: function(value){
                if(!value) {
                    return '请填最大上课人数';
                }
            },
            status: function (value) {
                if(!value)
                    return '请选择课程状态';
            },
            agerange: function(value){
                if(!value) {
                    return '适龄年龄段不能为空';
                }
            }
        });

        form.on('select(coachidchange)', function(data) {
            var assistants = assistant.value('assistantids', 'val');
            if(assistants&&assistants.length>0) {
                for(var i=0;i<assistants.length;i++) {
                    if(assistants[i]==data.value) {
                        layer.msg("主教练和助教冲突");
                        $("#coachid").val("");
                    }
                }
            }
        });

        //监听提交
        form.on('submit(saverecordinfo)', function(data){
            $.ajax({
                data : data.field,
                type : "POST",
                url : "${pageContext.request.contextPath}/eyas/recordinfo/saveRecordInfo",
                dataType : "json",
                success: function(data) {
                    layer.msg("保存成功,页面将在1秒后关闭");
                    setTimeout(function () {
                        var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                        parent.layer.close(index); //再执行关闭
                    },1000);
                },
                error:function(xdata){
                    layer.msg(xdata.responseJSON.errormsg);
                }
            });
            return false;
        });

        //加载status字典
        selectRECORDSTATUS();

        //加载classinfo
        selectClassInfo();

        //加载教练下拉框
        selectCoachInfo();

        //助教下拉框
        selectAssitants();

        //适龄年龄段
        selectAgeRange();
    });


    function selectRECORDSTATUS(){
        $.ajax({
            url:"${pageContext.request.contextPath}/eyas/admin/dictionary/RECORDSTATUS",
            type:"GET",
            dataType:"json",
            success:function(result){
                var list = result;    //返回的数据
                var role = document.getElementById("status");        //add_role_name给select定义的id
                for(var i=0;i<list.length;i++){
                    var option = document.createElement("option");    // 创建添加option属性
                    option.setAttribute("value",list[i].keycode);                  // 给option的value添加值
                    if(list[i].keycode=='${recordInfo.status}')
                        option.setAttribute("selected","selected");
                    option.innerText=list[i].keyworlds;             // 打印option对应的纯文本 （超级管理员、管理员）
                    role.appendChild(option);                          // 给select 添加option子标签
                }

                form.render("select");                                // 刷性select，显示出数据
            },
            error:function(xdata){
                layer.msg(xdata.responseJSON.errormsg);
            }
        });
    }

    function selectClassInfo() {
        $.ajax({
            url:"${pageContext.request.contextPath}/eyas/classinfo/queryClassInfoList",
            type:"GET",
            dataType:"json",
            success:function(result){
                var list = result;    //返回的数据
                var role = document.getElementById("classid");        //add_role_name给select定义的id
                for(var i=0;i<list.length;i++){
                    var option = document.createElement("option");    // 创建添加option属性
                    option.setAttribute("value",list[i].classid);                  // 给option的value添加值
                    if(list[i].classid=='${recordInfo.classid}')
                        option.setAttribute("selected","selected");
                    option.innerText=list[i].classname;             // 打印option对应的纯文本 （超级管理员、管理员）
                    role.appendChild(option);                          // 给select 添加option子标签
                }

                form.render("select");                                // 刷性select，显示出数据
            },
            error:function(xdata){
                layer.msg(xdata.responseJSON.errormsg);
            }
        });
    }

    function selectCoachInfo() {
        $.ajax({
            url:"${pageContext.request.contextPath}/eyas/coachinfo/queryCoachInfoList",
            type:"GET",
            dataType:"json",
            success:function(result){
                var list = result;    //返回的数据
                var role = document.getElementById("coachid");        //add_role_name给select定义的id
                for(var i=0;i<list.length;i++){
                    var option = document.createElement("option");    // 创建添加option属性
                    option.setAttribute("value",list[i].coachid);                  // 给option的value添加值
                    if(list[i].coachid=='${recordInfo.coachid}')
                        option.setAttribute("selected","selected");
                    option.innerText=list[i].coachname;             // 打印option对应的纯文本 （超级管理员、管理员）
                    role.appendChild(option);                          // 给select 添加option子标签
                }

                form.render("select");                                // 刷性select，显示出数据
            },
            error:function(xdata){
                layer.msg(xdata.responseJSON.errormsg);
            }
        });
    }

    function selectAssitants() {
        assistant.data('assistantids', 'server', {
            url: '${pageContext.request.contextPath}/eyas/coachinfo/queryAssistantList/'+${recordInfo.recordid==null?-1:recordInfo.recordid},
            keyword: ''
        });
    }



    function selectAgeRange(){
        $.ajax({
            url:"${pageContext.request.contextPath}/eyas/admin/dictionary/AGERANGE",
            type:"GET",
            dataType:"json",
            success:function(result){
                var list = result;    //返回的数据
                var role = document.getElementById("agerange");        //add_role_name给select定义的id
                for(var i=0;i<list.length;i++){
                    var option = document.createElement("option");    // 创建添加option属性
                    option.setAttribute("value",list[i].keycode);                  // 给option的value添加值
                    if(list[i].keycode=='${recordInfo.agerange}')
                        option.setAttribute("selected","selected");
                    option.innerText=list[i].keyworlds;             // 打印option对应的纯文本 （超级管理员、管理员）
                    role.appendChild(option);                          // 给select 添加option子标签
                }

                form.render("select");                                // 刷性select，显示出数据
            },
            error:function(xdata){
                layer.msg(xdata.responseJSON.errormsg);
            }
        });
    }

</script>
</html>
